<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		#div1 {width: 200px; height: 200px;border:1px solid #000;/* position: relative;*/}
		#div2 {width: 100px; height: 100px;border:1px solid #000;margin: 220px;}
		#div3 {width: 50px; height: 50px;border:1px solid #000;margin: 100px;}
	</style>
	<script src="jquery-1.10.1.min.js"></script>
	<script type="text/javascript">
/*	$()下的常用方法
		parent(): 获取被选元素的直接父级
		parents(): 获取被选元素的所有父级,一路向上直到根元素<html>(包含).可以传一个参数，筛选功能
		parentsUtil() : 在指定参数内获取被选元素的所有父级(不包括自身，不包括参数对应的元素)

		offsetParent():获取有定位的父级,如果没有就默认是body
*/
	$(function () {
		// $('[title]').parent().css('background', 'red');

		// $('#div3').parents().css('background', 'red');
		// $('#div3').parents('#div1').css('background', 'red');
		
		// $('#div3').parentsUntil('#div1').css('background', 'red');

		// $('#div2').offsetParent().css('background', 'red');			//试一下给div1加定位
	})
	</script>
</head>
<body>
	<div id="div1">div1
		<div id="div2" title="hello">div2
			<div id="div3">div3</div>
		</div>
	</div>
</body>
</html>